<style>
    #formorder input{max-width: 100px;height: 100%;}
    #formorder input.yes{border: 1px solid transparent;background-color: transparent;}
    #formorder input.yes:focus,#formorder input.no{border: 1px solid #60AFFF;}
    
    .a_click a{
        display: inline-block;
        text-align: center;
        padding: 2px 8px;
        background-color: #5bc0de;
        color: #fff;
        border-radius: 5px;
        margin: 3px 0;
    }
    .a_click a:hover{background-color: #46b8da;}
    
    #add{text-align: center;width: 100%;}
    #add a{display: inline-block;padding: 10px 0;}
    
    #formdiv{padding: 10px 10px;}
    #formdiv button{border: 1px solid transparent;background: #5bc0de;padding: 4px 5px 2px 5px;font-size: 12px;color: #fff;border-radius: 3px;}
</style>

<section class="vbox">
    <section class="scrollable padder">
        <ul class="breadcrumb no-border no-radius b-b b-light pull-in">
            <li><a href="#"><i class="fa fa-home"></i>酒店管理中心</a></li>
            <li><a href="#">酒店管理</a></li>
            <li><a href="#">房型管理</a></li>
        </ul>
        <div class="m-b-md">
            <h3 class="m-b-none"><span style="float:right;"></span>房型管理</h3>
        </div>
        <section class="panel panel-default">
            <header class="panel-heading">
                <i data-title="ajax to load the data." data-placement="bottom" data-toggle="tooltip" class="fa fa-info-sign text-muted" data-original-title="" title=""></i> 
                <b>房型管理</b>
                <label style="color: #46b8da;font-weight: normal;"></label>
                <label style="font-size: 12px;font-weight: normal;color: #FF6F6F;">---点击内容可修改房型信息，图片管理红色表示：无图片</label>
            </header>
            <div id="formdiv">
                <form id="get_formdiv" action="<?=$this->url("hotel/type")?>" method="get">
                    房型/床型 <input type="text" name="name" value="<?=empty($name)?'':$name?>" placeholder="房型/床型" />
                    <button>搜索</button>
                    <a href="<?=$this->url("hotel/type")?>" style="margin-left: 10px;color: red;font-size: 12px;">显示全部</a>
                </form>
            </div>
            <div style="overflow: auto;">
                <table data-ride="datatables" class="table table-striped m-b-none dataTable" id="DataTables_Table_0" style="width: 100%;border-bottom: 1px solid #E0E0E0;" >
                <thead>
                    <tr role="row">
                        <th>房型</th>
                        <th>床型</th>
                        <th>楼层</th>
                        <th>面积(㎡)</th>
                        <th>最多入住人数</th>
                        <th>底价(元)</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody id="formorder">
                <?
                    if(!empty($re)){
                        foreach($re as $k=>$v){?>
                            <tr id="form<?=$k?>">
                                <td><input type="text" name="title" value="<?=$v['title']?>" class="yes" /></td>
                                <td><input type="text" name="bed" value="<?=$v['bed']?>" class="yes" /></td>
                                <td><input type="text" name="floor" value="<?=$v['floor']?>" class="yes" /></td>
                                <td><input type="text" name="area" value="<?=$v['area']?>" class="yes" /></td>
                                <td><input type="text" name="maxnumber" value="<?=$v['maxnumber']?>" class="yes" /></td>
                                <td><input type="text" name="price" value="<?=$v['price']?>" class="yes" /></td>
                                <td class="a_click">
                                    <a href="javascript:void(0);" onclick="show_border(this,'<?=$k?>')" lang="0" >编辑</a>
                                    <a href="javascript:void(0);" class="show_shadefrist" onclick="edit('<?=$k?>','<?=$v['id']?>')" >保存</a>
                                    <a href="<?=$this->url("hotel/picture?typeid=".$v['id'])?>" <?=$v['pictureNum']<1?'style="background-color: #FF4444"':''?> >图片管理</a>
                                    <!--<a href="javascript:void(0);" onclick="status('<?=$v["id"]?>')" <?=$v['status']=='0'?'style="background-color: #FF3535;"':''?> ><?=$v['status']=='0'?'开房':'关房'?></a>-->
                                    <!--<a href="javascript:void(0);" class="show_shadefrist" onclick="del('<?=$v["id"]?>')" >删除</a>-->
                                </td>
                            </tr>
                        <?}
                    }else{?>
                        <tr id="form20000">
                            <td><input type="text" name="title" value="" class="no" /></td>
                            <td><input type="text" name="bed" value="" class="no" /></td>
                            <td><input type="text" name="floor" value="" class="no" /></td>
                            <td><input type="text" name="area" value="" class="no" /></td>
                            <td><input type="text" name="maxnumber" value="" class="no" /></td>
                            <td><input type="text" name="price" value="" class="no" /></td>
                            <td class="a_click">
                                <a href="javascript:void(0);" class="show_shadefrist" onclick="edit(20000,0)" >保存</a>
                            </td>
                        </tr>
                    <?}
                ?>
                </tbody>
                </table>
                <div id="add"><a href="javascript:void(0);" lang="0" class="20001" ><i class="fa fa-plus-square icon"> 添加房型</i></a></div>
            </div>
        </section>
    </section>
</section>
<a href="#" class="hide nav-off-screen-block" data-toggle="class:nav-off-screen" data-target="#nav"></a>
<script type="text/javascript">
$('#add a').click(function(){
    var th=$(this).attr('lang');
    if(th==0){
        var i=$(this).attr('class');
        var newhtml='<tr id="form'+i+'">';
                newhtml+='<td><input type="text" name="title" value="" class="no" /></td>';
                newhtml+='<td><input type="text" name="bed" value="" class="no" /></td>';
                newhtml+='<td><input type="text" name="floor" value="" class="no" /></td>';
                newhtml+='<td><input type="text" name="area" value="" class="no" /></td>';
                newhtml+='<td><input type="text" name="maxnumber" value="" class="no" /></td>';
                newhtml+='<td><input type="text" name="price" value="" class="no" /></td>';
                newhtml+='<td class="a_click">';
                    newhtml+='<a href="javascript:void(0);" class="show_shadefrist" onclick="edit('+i+',0)" style="margin-right: 7px;" >保存</a>';
                    newhtml+='<a href="javascript:void(0);" onclick="delnewhtml('+i+')" >删除</a>';
                newhtml+='</td>';
            newhtml+='</tr>';
        $("#formorder").append(newhtml);
        $(this).attr('lang',1);
    }
});
function delnewhtml(obj){
    if(confirm("确认删除？")){
        $("#form"+obj).remove();
        $('#add a').attr('lang',0);
    }
}
function edit(obj,id){
    var title=$("#form"+obj+" input[name='title']").val();
    var bed=$("#form"+obj+" input[name='bed']").val();
    var floor=$("#form"+obj+" input[name='floor']").val();
    var area=$("#form"+obj+" input[name='area']").val();
    var maxnumber=$("#form"+obj+" input[name='maxnumber']").val();
    var price=$("#form"+obj+" input[name='price']").val();
    if(title==''||bed==''||floor==''||area==''||maxnumber==''||price==''){
        pub_alert_error("请填写完整！",2000);
    }else{
        $.ajax({
    		type:'POST',
    		url:'<?=$this->url("hotel/typeEdit")?>',
    		data:'id='+id+'&title='+title+'&bed='+bed+'&floor='+floor+'&area='+area+'&maxnumber='+maxnumber+'&price='+price,
    		dataType:'json',
    		success:function(r){
                if(r.state==1){
                    pub_alert_success(r.html,2000);
                    setTimeout(function(){window.location.reload()},2000);
                }else if(r.state==0){
                    pub_alert_error(r.html,2000);
                }
    		},
            error:function(){
                pub_alert_error("ajax出现错误",2000);
            }
    	});
    }
}
function del(id){
    if(confirm("删除后不可恢复！确认删除？")){
        $.ajax({
    		type:'POST',
    		url:'<?=$this->url("hotel/typeDel")?>',
    		data:'id='+id,
    		dataType:'json',
    		success:function(r){
                if(r.state==1){
                    pub_alert_success(r.html,2000);
                    setTimeout(function(){window.location.reload()},2000);
                }else if(r.state==0){
                    pub_alert_error(r.html,2000);
                }
    		},
            error:function(){
                pub_alert_error("ajax出现错误",2000);
            }
    	});
    }
}

//编辑 显示input border
function show_border(to_this,obj){
    var to_lang=$(to_this).attr("lang");
    if(to_lang==0){
        $("#form"+obj+" td input").css({"border":"1px solid #60AFFF"})
        $(to_this).attr("lang",1);
        $(to_this).html("取消");
    }else{
        $("#form"+obj+" td input").css({"border":"1px solid transparent"})
        $(to_this).attr("lang",0);
        $(to_this).html("编辑");
    }
}
</script>